import { businessExtraAdd } from "@/services/workOrder";
import { formatMessage } from 'umi-plugin-react/locale';
import { Form, Input, Modal } from "antd";
import React from "react";

class ExtraFields extends React.Component{
  constructor(props){
    super(props);
    this.state = {
      visible:false,
      type:null,
      ticketId:null
    }
  }

  componentDidMount(){
    if(this.props.onRef){
      this.props.onRef(this)
    }
  }

  initModal = data => {
    this.setState(data)
  }

  doCancel = () => {
    this.props.form.resetFields()
    this.setState({
      visible:false,
      type:null,
      ticketId:null
    })
  }

  doValidate = () => {
    this.props.form.validateFields((error,values) => {
      if(!error){
        this.doSubmit(values)
      }
    })
  }

  doSubmit = async values => {
    const { type,ticketId } = this.state;
    const res = await businessExtraAdd({...values,type,ticketId})
    this.props.updateInfo()
    this.doCancel()
  }

  render(){
    const { visible,type } = this.state;
    const { form:{getFieldDecorator} } = this.props;
    const formItemLayout = {
      labelCol: {
        xs: { span: 24 },
        sm: { span: 6 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 18 },
      },
    };
    return (
      <Modal
        visible={visible}
        title={type == 0 ? formatMessage({ id: 'workOrderProcessing.extraFields.transferProduct' }) : type == 1 ? formatMessage({ id: 'workOrderProcessing.extraFields.transferDevelopment' }) : type == 2 ? formatMessage({ id: 'workOrderProcessing.extraFields.associateProject' }) : ''}
        onCancel={this.doCancel}
        onOk={this.doValidate}
      >
        <Form {...formItemLayout}>
          <Form.Item label={type == 0 ? formatMessage({ id: 'workOrderProcessing.extraFields.productTicket' }) : type == 1 ? formatMessage({ id: 'workOrderProcessing.extraFields.developmentTicket' }) : type == 2 ? formatMessage({ id: 'workOrderProcessing.extraFields.projectName' }) : ''}>
            {
              getFieldDecorator("fieldA")(
                <Input />
              )
            }
          </Form.Item>
          <Form.Item label={type == 0 ? formatMessage({ id: 'workOrderProcessing.extraFields.productLink' }) : type == 1 ? formatMessage({ id: 'workOrderProcessing.extraFields.developmentLink' }) : type == 2 ? formatMessage({ id: 'workOrderProcessing.extraFields.projectNumber' }) : ''}>
            {
              getFieldDecorator("fieldB")(
                <Input />
              )
            }
          </Form.Item>
        </Form>
      </Modal>
    )
  }


}

export default Form.create()(ExtraFields)